<template>
  <div class="match" >
    <el-scrollbar always v-loading="dialogState.matchListLoading">
      <div class="league_match_list">
        <template v-if="homeState.match.data.length > 0">
          <LeagueMatch
            v-for="(item, index) in homeState.match.data"
            :key="item.league_id"
            :data="item"
            :style="index != 0 ? 'margin-top: 12px' : ''"
          />
        </template>
        <template v-if="homeState.match.data.length == 0">
          <el-empty :image-size="120" :description="languageJson.message.nodata" />
        </template>
      </div>
    </el-scrollbar>
  </div>
</template>

<script setup>
import LeagueMatch from './LeagueMatch.vue'
const languageJson = inject('languageJson')
const languageType = inject('languageType')
const { dialogStore, dialogState } = inject('DialogStore')
const { homeStore, homeState } = inject('HomeStore')
</script>

<style lang="scss" scoped>
.match {
  height: calc(100% - 60px);
}
.league_match_list {
  padding: 0 12px;
}
</style>
